import Link from './components/link'
import View from './components/view'

export let _Vue
export default function (Vue, options) {
  _Vue = Vue
  // 全局混入
  Vue.mixin({
    beforeCreate() {
      // this指向的是当前组件的实例
      if (this.$options.router) {
        this._routerRoot = this // 给当前根实例增加一个属性
        this._router = this.$options.router

        this._router.init(this) // 这里this 指的是根实例
        // 将current属性变成响应式的
        Vue.util.defineReactive(this, '_route', this._router.history.current)
        console.log('this._route', this._route)
      } else {
        // 组件渲染是一层层的渲染
        this._routerRoot = this.$parent && this.$parent._routerRoot
      }
    }
  })

  // 核心内容
  Vue.component('router-link', Link) // 注册组件
  Vue.component('router-view', View) // 注册组件
  /* Vue.component('router-link', {
    render: h => h('a', {}, '')
  })
  Vue.component('router-view', {
    render: h => h('div', {}, '')
  }) */

  // 只能读取 不能修改
  Object.defineProperty(Vue.prototype, '$route', {
    get() {
      return this._routerRoot._route // path matched
    }
  })
  Object.defineProperty(Vue.prototype, '$router', {
    get() {
      return this._routerRoot._router // push go replace 等方法
    }
  })
}
